<!DOCTYPE html>
<html>
{% load staticfiles %}
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1, user-scalable=no">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="#B4E6FB">
    <title>{{ title }}</title>
</head>
<style type="text/css">
    .Kline-div {
        width: 100%;
        bottom: 0rem;
        top: 0;
    }

    .Kline-div .m-line {
        height: 500px;
        width: 500px;
        margin-bottom: 1%;
    }

    .Kline-div .K-line {
        height: 500px;
        width: 500px;
    }
</style>
<body>
{% csrf_token %}
<div id="Kline-div" class="Kline-div">
    <div id="m-line" class="m-line"></div>
    <p id="stock_name"></p>
    <div id="k-content" class="K-line"></div>
</div>
<img src="data:image/png;base64,{{ save_file_base64 }}">
<p>{{ accuracy }}</p>
<script src="{% static 'assets/vendors/jquery-3.1.1.min.js' %}" type="text/javascript"></script>
<script src="{% static 'stocksys/js/echarts.min.js' %}" type="text/javascript" charset="utf-8"></script>
<script src="{% static 'stocksys/js/k-line.js' %}" type="text/javascript" charset="utf-8"></script>
<script>
    var csrf = $('input[name="csrfmiddlewaretoken"]').val();
    $.ajax({
        url: "/stocksys/stock_info/600000/2018",
        data: {'csrfmiddlewaretoken': csrf},
        dataType: "json",
        type: "POST",
        success: function (data) {
            kdata = data["data"];
            var kChart = echarts.init(document.getElementById('k-content'));
            var stock_name = document.getElementById('stock_name');
            stock_name.innerText=data["stock_name"]
            kChart.setOption(initKOption(kdata));
        },
        error: function (xhr, status, error) {

        }
    });
    $.ajax({
        url: "/stocksys/stock_time_info/",
        data: {'csrfmiddlewaretoken': csrf},
        dataType: "json",
        type: "POST",
        success: function (data) {
            mdata = data;
            var mChart = echarts.init(document.getElementById('m-line'));
            mChart.setOption(initMOption(mdata, 'us'));
        },
        error: function (xhr, status, error) {

        }
    });

</script>
</body>
</html>
